<form style="margin-left: -20px;" class="form-horizontal" name="auditQueryForm">
    <div class="form-group">
        <div class="col-md-3">
            <span class="col-md-4 control-label">UUID</span>
            <div class="col-md-8">
                <input type="text" class="form-control" placeholder="{{'auditMgr.transactionKey' | translate}}" ng-model="auditQuery.reqUuid" maxlength="40">
            </div>
        </div>
        <div class="col-md-3">
            <span class="col-sm-4 control-label">minElapse</span>
            <div class="col-sm-8">
                <input type="text" class="form-control" placeholder="{{'auditMgr.minTime' | translate}}" ng-model="auditQuery.minReqElapse" maxlength="10">
            </div>
        </div>
        <div class="col-md-6">
            <span class="col-md-4 control-label">maxElapse</span>
            <div class="col-md-8">
                <input type="text" class="form-control" placeholder="{{'auditMgr.maxTime' | translate}}" ng-model="auditQuery.maxReqElapse" maxlength="10">
            </div>
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-3">
            <span class="col-md-4 control-label">userId</span>
            <div class="col-md-8">
                <input type="text" class="form-control" placeholder="{{'auditMgr.userid' | translate}}" ng-model="auditQuery.userId" maxlength="16">
            </div>
        </div>
        <div class="col-md-3">
            <span class="col-md-4 control-label">minDate</span>
            <div class="col-md-8">
                <p class="input-group">
                    <input type="text" class="form-control" placeholder="{{'auditMgr.startTime' | translate}}" uib-datepicker-popup ng-model="auditQuery.minRequestDate" is-open="popupFrom.opened" datepicker-options="fromDateOptions" close-text="Close" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="openFrom()"><i class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </p>
            </div>
        </div>
        <div class="col-md-6">
            <span class="col-md-4 control-label">maxDate</span>
            <div class="col-md-8">
                <p class="input-group">
                    <input type="text" class="form-control" placeholder="{{'auditMgr.endTime' | translate}}" uib-datepicker-popup ng-model="auditQuery.maxRequestDate" is-open="popupEnd.opened" datepicker-options="endDateOptions" close-text="Close" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="openEnd()"><i class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </p>
            </div>
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-3">
            <span class="col-md-4 control-label">param</span>
            <div class="col-md-8">
                <input type="text" class="form-control" placeholder="{{'auditMgr.filterString' | translate}}" ng-model="auditQuery.reqParam" maxlength="30">
            </div>
        </div>
        <div class="col-md-3">
            <span class="col-md-4 control-label">success</span>
            <div style="margin-left: 8px;" class="btn-group" uib-dropdown is-open="successDropdown.isOpen">
                <button type="button" class="btn btn-primary" uib-dropdown-toggle>
                    <span style="padding-left: 5px;padding-right: 5px;" ng-bind="successDropdown.option.name"></span>
                    <span class="caret"></span>
                </button>
                <ul uib-dropdown-menu role="menu" aria-labelledby="single-button">
                    <li ng-repeat="it in successDropdown.items">
                        <a ng-click="successDropdown.selectOption(it)" ng-bind="it.name"></a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-md-6">
            <span class="col-md-4 control-label">orderBy</span>
            <div class="btn-group" uib-dropdown is-open="orderByDropdown.isOpen">
                <button type="button" class="btn btn-primary" uib-dropdown-toggle>
                    <span style="padding-left: 5px;padding-right: 5px;" ng-bind="orderByDropdown.option.name"></span>
                    <span class="caret"></span>
                </button>
                <ul uib-dropdown-menu role="menu" aria-labelledby="single-button">
                    <li ng-repeat="it in orderByDropdown.items">
                        <a ng-click="orderByDropdown.selectOption(it)" ng-bind="it.name"></a>
                    </li>
                </ul>
            </div>
            <div class="btn-group" uib-dropdown is-open="ascDescDropdown.isOpen">
                <button type="button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="orderByDropdown.option == null || orderByDropdown.option.value == null">
                    <span style="padding-left: 5px;padding-right: 5px;" ng-bind="ascDescDropdown.option.name"></span>
                    <span class="caret"></span>
                </button>
                <ul uib-dropdown-menu role="menu" aria-labelledby="single-button">
                    <li ng-repeat="it in ascDescDropdown.items">
                        <a ng-click="ascDescDropdown.selectOption(it)" ng-bind="it.name"></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</form>

<div class="panel-body pull-right">
    <a class="btn btn-info" ng-click="delete()" role="button">{{'auditMgr.delLog' | translate}}</a>
    <button class="btn btn-info" ng-click="query()">{{'auditMgr.queryLog' | translate}}</button>
</div>
<div>
    <div style="padding-top: 8px;margin-left: 14px;">{{'auditMgr.msgPre' | translate}} {{totalCount ? totalCount:0}} {{'auditMgr.msgSuffix' | translate}}</div>
    <input style="margin-left: 14px;width: 24%;margin-bottom: 4px;" type="text" class="form-control" ng-model="predicate" placeholder="{{'auditMgr.filterInPage' | translate}}" />
    <div ng-repeat="audit in audits | filter:predicate:comparator">
        uuid:{{audit.reqUuid}} | userId:{{audit.userId}} | url:{{audit.reqUrl}} | class:{{audit.reqClass}} | param:{{audit.reqParam}} |
        date: {{audit.requestDate | date:'yyyy-MM-dd HH:mm'}} | exception:{{audit.reqException}} | elapse:{{audit.reqElapse}} | success:{{audit.reqSuccess}} |
        method: {{audit.reqMethod}} | ip: {{audit.reqIp}} | seq: {{audit.reqSequence}}
    </div>
</div>